  // 1, 通过 tools.js 中封装的 函数 获取 浏览器地址栏传参数据
  const valObj = myGetUrlValObj();
  console.log( valObj.goods_id );

  // 2, 发送请求 获取 响应体数据
  const xhr = myPromiseJQueryAjax( '../server/goods_detail.php' , 'post' , {goods_id:valObj.goods_id} , 'json' );
  xhr.then(function(res){
    console.log(res);
    // 根据结果 动态渲染生成页面
    let str = `
    <div class="panel panel-default">
      <div class="panel-heading">
        <h3 class="panel-title">商品详细信息</h3>
      </div>
      <div class="panel-body">
        <div class="media">
          <div class="media-left">
            <a href="#">
              <img class="media-object" src="${res.goods_big_logo}" alt="...">
            </a>
          </div>
          <div class="media-body">
            <h4 class="media-heading">${res.goods_name}</h4>
            <p>
              <i class="glyphicon glyphicon-yen"></i>
              <span>${res.goods_price}</span>
            </p>
            <div class="btn-group" role="group" aria-label="...">
              <button type="button" class="btn btn-default">XL</button>
              <button type="button" class="btn btn-default">L</button>
              <button type="button" class="btn btn-default">M</button>
              <button type="button" class="btn btn-default">S</button>
              <button type="button" class="btn btn-default">XS</button>
            </div>
            <p style="position:relative">
              <input value="1" class="num">
              <button name="减" type="button" class="jian btn btn-default">-</button>
              <button name="加" type="button" class="jia btn btn-default">+</button>
            </p>
            <p>
              <a href="javascript:;" class="btn btn-warning btn-lg" role="button">立即购买</a>
              <a href="javascript:;" name="cart" class="btn btn-danger btn-lg" role="button">加入购物车</a>
            </p>
          </div>
        </div>
        <ul class="nav nav-tabs">
          <li role="presentation" class="active"><a href="#">商品详细信息</a></li>
          <li role="presentation"><a href="#">商品参数信息</a></li>
          <li role="presentation"><a href="#">相关商品</a></li>
        </ul>
        <div>
          ${res.goods_introduce}
        </div>
      </div>
    </div>
    
    `;

    $('.container').html(str);

    // 3, 给 + - 按钮 添加点击事件
    // 页面内容是 动态生成的 给 父级标签 添加 点击事件 
    // 通过 事件委托 来完成效果
    $('.container').click( function(e){
      if(e.target.getAttribute('name') === '减' ){
        // 获取 input中的数据 -1 之后 再 赋值回来
        // 如果 小于 1 就 赋值 1 如果 大于1 就 赋值 这个数值本身
        $('.num').val( $('.num').val() - 1 < 1 ? 1 :  $('.num').val() - 1 );
      }else if(e.target.getAttribute('name') === '加' ){
        // 获取 input中的数据 +1 之后 再 赋值回来
        // 如果 大于 库存数值 就赋值 库存数值本身 如果 不大于 库存数值 赋值 数值本身
        $('.num').val( $('.num').val()-0 + 1 > res.goods_number ? res.goods_number :  $('.num').val()-0 + 1 );
      
      // 4, 点击购物车
      }else if( e.target.getAttribute('name') === 'cart' ){
        // 1, 判断 用户 有没有登录
        // 如果 没有 登录 跳转登录页面 去 执行登录操作
        // 获取cookie数据对象
        const cookieObj = myGetCookie();
        
        // 没有登录的情况
        if( cookieObj.login !== '1' ){
          // 登录状态码 不是 1 证明 还没有登录
          // 弹出提示框 点击确定 跳转 登录页面
          if( window.confirm('您还没有登录,点击确定跳转登录页面') ){
            window.location.href = `./login.html?url=${window.location.href}`;

          }

          // 终止之后的操作
          return ; 
        }            
        
        // 已经登录的情况

        // (1) 获取 购物车 数据信息


        // 没有购物车 信息 获取结果是 undefined
        let cart = localStorage.cart;
        console.log( res )

        if ( cart === undefined ){
          // 没有创建 购物车 信息 
          // 直接 添加 当前商品信息 

          // 给当前商品的商品信息 添加 属性和属性值

          // 判断购买数量 符合 数值范围
          // 1 - 库存
          console.log(  )
          if( !($('.num').val()-0 >= 1 && $('.num').val()-0 <= res.goods_number) ){
            window.alert('您数值的数值超出范围应该是 1-库存');
            return;
          }  

          // 购买数量
          res.num = $('.num').val()-0;

          // 购买状态 新增商品 购买状态 默认是 购买
          res.buy = true;

          // localStorage 字符串 和 json字符串
          // 将 商品 信息转化为 json字符串 存储
          // 存储的数据结构 必须是 数组中存储对象 不能直接存储对象

          // localStorage.setItem( 'cart' , JSON.stringify( [res] )  );

          localStorage.cart = JSON.stringify( [res] ) ;
        
        // 购物车 数据信息 已经存在
        }else{
          // 先将 存储的 json字符串数 还原为对应的数据类型
          cart = JSON.parse( cart );
          
          // 当前购物车 是一个 空数组
          if( cart.length === 0 ){
            // 直接 添加 商品信息
            if( !( $('.num').val()-0 >= 1 && $('.num').val()-0 <= res.goods_number ) ){
              window.alert('购买数量有误');
              return;
            }

            res.num = $('.num').val()-0;
            res.buy = true;

            localStorage.cart = JSON.stringify( [res] );

          // 当前购物车 不是 空车
          }else{
            // 如果 购物车 没有 这个商品 直接添加
            // 如果 购物车 有这个 商品 添加 购买数量

            // 当前商品 在 购物车 中 结果是 true
            // 当前商品 不在 购物车 中 结果是 false
            let bool = cart.some(function(val){
              // 购车商品id 和 当前商品id  相等
              return val.goods_id === res.goods_id;
            })

            if( bool ){
              // 给 对应的 商品 添加 购买数量
              // 循环遍历 找到 goods_id相同的商品
              for(let i = 0 ; i <= cart.length-1 ; i++){
                if( cart[i].goods_id === res.goods_id ){
                  // 如果 购物车商品id 和 当前商品id 相同
                  // 添加 购买商品个数
                  let numAdd = (cart[i].num-0) + ( $('.num').val()-0);

                  // 判断 添加 新的数量之后 购买 数量 在 正确的范围之间
                  if( !(numAdd >= 1 && numAdd <= cart[i].goods_number) ){
                    window.alert('您输入的商品范围有误');
                    return;
                  }

                  // 修改购物车 数据中 购买商品的商品数量
                  cart[i].num = numAdd;
                  // 将 新的 购物车数据数组 再 设定给 localStorage中购物车数据
                  localStorage.cart = JSON.stringify( cart );
                }
              }
            
            // 当前购物车中没有当前要添加的这个商品
            }else{
              // 补充当前商品的购买数量和购买状态
              // 将 新的对象 写入到 数组的起始位置
              // 将 新的数组 设定给 localStorage 中 购物车数据
              if( !( $('.num').val()-0 >= 1 && $('.num').val()-0 <= res.goods_number ) ){
                window.alert( '您输入的商品数据有误' );
                return;
              }

              res.num = $('.num').val()-0;
              res.buy = true;
              cart.unshift( res );
              localStorage.cart = JSON.stringify( cart );
            }
            
          } 

        
        }

        // 添加 完 购物车 信息后 跳转 购物车页面
        window.location.href = './cart.html';

      }
    }) 
  })
